<!doctype html>
<html>

<head>
    <meta charset="utf-8">
    <title>jquery购物车</title>
    <script src="https://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script>
    <script src="../js/购物车.js"></script>
    <style>
        img {
            width: 80px;
            height: 80px
        }

        a {
            color: black;
            text-decoration: none;
        }

        .mony {
            width: 20px;
            text-align: center;
        }
    </style>
</head>

<body>
    <div>全部商品</div>
    <!-- 一个表单元素 -->
    <form action="">
        <table style="border-collapse: 0px;border-spacing: 0px;width:872px">
            <tbody>
                <tr style="background-color:grey;">
                    <td style="width:60px"><input type="checkbox" class="choseall">全选</td>
                    <td style="width:472px;height:40px">商品</td>
                    <td style="width:60px">单价</td>
                    <td style="width:100px">数量</td>
                    <td style="width:110px">小计</td>
                    <td style="width:70px">操作</td>
                </tr>
                <tr>
                    <td><input type="checkbox" class="goodchose"></td>
                    <td>
                        <div>
                            <div style="float:left">
                                <a href="">
                                    <img src="https://www.jq22.com/img/cs/500x500-4.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="javascript:;">【新势力周】YUKI小树家可爱趣味印花短款白T恤+卡扣高腰宽松复古阔腿牛仔长裤</a>
                            </div>
                        </div>
                    </td>
                    <td class="onemony">￥37.00</td>
                    <td>
                        <input type="button" value="-" class="jian">
                        <input type="text" class="mony" value="1">
                        <input type="button" value="+" class="add">
                    </td>
                    <td class="totalmony">￥37.00</td>
                    <td class="deletthis">删除</td>
                </tr>
                <tr>
                    <td><input type="checkbox" class="goodchose"></td>
                    <td>
                        <div>
                            <div style="float:left">
                                <a href="">
                                    <img src="https://www.jq22.com/img/cs/500x500-3.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="javascript:;">日系正肩短袖t恤女夏薄款设计感小众日系甜酷学生小个子宽松上衣</a>
                            </div>
                        </div>
                    </td>
                    <td class="onemony">￥49.90</td>
                    <td>
                        <input type="button" value="-" class="jian">
                        <input type="text" class="mony" value="1">
                        <input type="button" value="+" class="add">
                    </td>
                    <td class="totalmony">￥49.90</td>
                    <td class="deletthis">删除</td>
                </tr>
                <tr>
                    <td><input type="checkbox" class="goodchose"></td>
                    <td>
                        <div>
                            <div style="float:left">
                                <a href="">
                                    <img src="https://www.jq22.com/img/cs/500x500-1.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="javascript:;">春秋格子衬衫外套女2022新款小个子设计感小众宽松慵懒风日系上衣</a>
                            </div>
                        </div>
                    </td>
                    <td class="onemony">￥69.90</td>
                    <td>
                        <input type="button" value="-" class="jian">
                        <input type="text" class="mony" value="1">
                        <input type="button" value="+" class="add">
                    </td>
                    <td class="totalmony">￥69.90</td>
                    <td class="deletthis">删除</td>
                </tr>
                <tr>
                    <td><input type="checkbox" class="goodchose"></td>
                    <td>
                        <div>
                            <div style="float:left">
                                <a href="">
                                    <img src="https://www.jq22.com/img/cs/500x500-2.png" alt="">
                                </a>
                            </div>
                            <div>
                                <a href="javascript:;">满减【百草味-红油面皮134g】方便面盒装速食凉皮拌泡面米粉凉皮</a>
                            </div>
                        </div>
                    </td>
                    <td class="onemony">￥23.70</td>
                    <td>
                        <input type="button" value="-" class="jian">
                        <input type="text" class="mony" value="1">
                        <input type="button" value="+" class="add">
                    </td>
                    <td class="totalmony">￥23.70</td>
                    <td class="deletthis">删除</td>
                </tr>
            </tbody>
        </table>
        <div
            style="position:fixed;bottom:0px;width:872px;background-color:rgb(184, 177, 177);height:50px;line-height: 50px;">
            <input type="checkbox" class="chosealllast">全选
            <span style="position:absolute;left:70px" class="chosedelet">删除选中的商品</span>
            <span style="position:absolute;left:200px" class="clearall">清理购物车</span>
            <span style="position:absolute;right:230px;" class="totoalgoodn">已经选0件商品</span>
            <span style="position:absolute;right:150px;">总价：</span>
            <span style="position:absolute;left:715px;color:red;font-weight: bold;" class="totalprice">￥12.60</span>


        </div>
    </form>

    <script>

    </script>

</body>

</html>